// 封装axios
// 1.axios.create 创建一个实例(baseURL/timeout/大数处理)
// 2.请求拦截器(token request headers)
// 3.响应拦截器(1.token失效 401 2.当后端不以200作为接口状态标识  手动处理)
import store from '@/store'
import axios from 'axios'

// 创建instance实例
const instance = axios.create({
  // 请求根地址
  baseURL: 'http://pcapi-xiaotuxian-front-devtest.itheima.net',
  // 过期时间
  timeout: 10000
})

// 请求拦截器
instance.interceptors.request.use(function (config) {
  // 在发送请求之前做些什么
  // 先从vuex中取出token
  const token = store.state.user.profile.token
  // 发请求时,如果有token就添加到请求头中
  if (token) {
    config.headers.Authorization = `Bearer ${token}`
  }
  return config
}, function (error) {
  // 对请求错误做些什么
  return Promise.reject(error)
})

// 响应拦截器
// http code 200 - 300 只要接口的状态在200 - 300之间 不管当前接口是成功还是失败 都走第一个回调
// http code 不在200 - 300 之间 会走第二个回调
instance.interceptors.response.use(function (response) {
  // 对响应数据做点什么
  return response
}, function (error) {
  // 对响应错误做点什么
  return Promise.reject(error)
})

// 需求:
// 封装一个函数  在函数中自动适配get和post请求的参数位置
// 传递参数的格式必须是一个对象
// 使用request进行接口调用 request('url','get','data').then((res) => console.log(res))

// 通用的接口函数
function request (url, method, data) {
  // 1.instance方法执行  2.把执行结果return
  return instance({
    url,
    method,
    // es6的写法,表达式必须要写在[]里面,将请求方式全部转成大写进行判断
    [method.toUpperCase() === 'GET' ? 'params' : 'data']: data
  })
}

export default request
